<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8" />
		<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
		<meta
			name="viewport"
			content="width=device-width,initial-scale=0.2,minimum-scale=0.2,maximum-scale=1,user-scalable=no"
		/>
		<!-- <meta name="viewport" content="width=device-width, initial-scale=1.0" /> -->
		<!-- <meta name="theme-color" content="#000000" /> -->
		<!-- <meta name="description" content="Web site created using create-react-app" /> -->
		<link rel="apple-touch-icon" href="%PUBLIC_URL%/favicon.ico" />
		<!--
      manifest.json provides metadata used when your web app is installed on a
      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
    -->
		<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
		<!--
      Notice the use of %PUBLIC_URL% in the tags above.
      It will be replaced with the URL of the `public` folder during the build.
      Only files inside the `public` folder can be referenced from the HTML.

      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
      work correctly both with client-side routing and a non-root public URL.
      Learn how to configure a non-root public URL by running `npm run build`.
    -->
		<title>三只狮子</title>
		<style>
			body {
				margin: 0;
			}

			.spinner-box {
				width: 100%;
				height: 100vh;
				display: flex;
				justify-content: center;
				align-items: center;
				background-color: #f5f5f5;
			}

			.circle-border {
				width: 150px;
				height: 150px;
				padding: 3px;
				border-radius: 50%;
				background: #ff8023;
				background: linear-gradient(0deg, rgba(63, 249, 220, 0.1) 33%, #ff8023 100%);
				animation: spin 0.8s linear 0s infinite;
			}

			.circle-core {
				width: 100%;
				height: 100%;
				background-color: #f5f5f5;
				border-radius: 50%;
			}

			@keyframes spin {
				from {
					transform: rotate(0);
				}

				to {
					transform: rotate(359deg);
				}
			}
		</style>
	</head>

	<body style="overflow: hidden">
		<div id="root">
			<div class="spinner-box">
				<div style="text-align: center">
					<div class="circle-border">
						<div class="circle-core"></div>
					</div>
					<div style="padding-top: 32px; color: #ff8023"></div>
				</div>
			</div>
		</div>
	</body>
</html>
